<template>
	<div>
		<uni-popup :custom="true" :isRadius="true" ref="popup">
			<div class="show_quit">
				<div class="header">
					设置离职状态
					<img @click="closequit(1)" class="closemask" :src="`${imgUrl}design/addfriclose.png`" alt />
				</div>
				<div class="quit_body">
					<div class="quitstatus" v-for="(item,index) in btn" :key="index" :class="{'quitbtn': isactive == index}" @click="shoosequit(index,item.quit_stid)">{{ item.quit }}</div>
				</div>
				<div class="quit_btom" @click="closequit(2)">确定</div>
			</div>
		</uni-popup>
	</div>
</template>

<script>
import uniPopup from '@/components/uni-popup/uni-popup'
import { postLeaveStatus } from '@/api/staffManage'

export default {
	name: 'QuitModule',
	components: {
		uniPopup
	},
	data() {
		return {
			btn: [{ quit: '驳回离职申请', quit_stid: 5 }, { quit: '同意离职', quit_stid: 4 }],
			isactive: -1,
			leave_type: '', // 离职状态值
			quitid: '', // 用户的id
			putllstatus: '',
			imgUrl: this.$constant.imgUrl
		}
	},
	methods: {
		shoosequit(index, quit_stid) {
			// 离职状态选择
			this.isactive = index
			this.leave_type = quit_stid
		},
		closequit(type) {
			// 关闭离职弹框
			if (type == 1) {
				this.closePop()
			} else if (this.leave_type == '') {
				uni.showToast({
					title: '请选择离职状态',
					icon: 'none'
				})
			} else {
				const data = {
					relation_user_id: this.quitid,
					leave_type: this.leave_type
				}
				postLeaveStatus(data).then(res => {
					uni.showToast({
						title: res.data.message,
						icon: 'success'
					})
					if (this.putllstatus === 'memberlist') {
						this.$parent.onRefresh()
					} else if (this.putllstatus === 'memberdetail') {
						this.$parent.getinformation()
					}
					this.closePop()
				})
			}
		},
		openPop() {
			this.$refs.popup.open()
		},
		closePop() {
			this.$refs.popup.close()
		}
	}
}
</script>

<style scoped lang="scss">
	@import '~@/static/css/base.scss';
	.show_quit {
		height: 415px;
		// width: 80%;
		background: white;
		top: 50%;
		border-radius: 15px;
		.header {
			height: 90px;
			position: relative;
			text-align: center;
			line-height: 90px;
			font-size: 34px;
			margin-bottom: 15px;
			.closemask {
				position: absolute;
				right: 30px;
				top: 30px;
			}
		}
		.quit_body {
			width: 100%;
			height: auto;
			float: left;
			.quitstatus {
				width: 380px;
				height: 70px;
				border-radius: 35px;
				float: left;
				margin-top: 24px;
				font-size: 30px;
				margin-left: 18%;
				line-height: 70px;
				text-align: center;
				background: #f5f5f5;
			}
			.quitbtn {
				background: #ffd11a;
			}
		}
		.quit_btom {
			width: 100%;
			height: 80px;
			float: left;
			bottom: 0;
			color: #ff6900;
			font-size: 36px;
			// position: fixed;
			line-height: 80px;
			text-align: center;
			margin-top: 20px;
			border-top: 1px solid #dddddd;
		}
	}
</style>
